import 'package:dmz/base/pageWidget/base_stateful_widget.dart';
import 'package:dmz/base/widget/defult_text_field.dart';
import 'package:dmz/base/widget/defult_widget.dart';
import 'package:dmz/business/home/controller/set_moto_controller.dart';
import 'package:dmz/business/home/model/moto_model.dart';
import 'package:dmz/string_res/str_res_keys.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import '../../../routers/routers.dart';
import '../controller/ota_record_controller.dart';
import '../model/purchase_model.dart';
import 'shanre_details_widgets.dart';

class SetMotoWidgets {
  static Widget backWidget(child) {
    return Container(
        decoration: const BoxDecoration(
            gradient: LinearGradient(
          begin: Alignment.topCenter, // 渐变起始位置
          end: Alignment.bottomCenter, // 渐变结束位置
          colors: [
            Color(0xFF000000),
            Color(0xFF050505),
            Color(0xFF2C2D35)
          ], // 渐变色数组
        )),
        child: child);
  }

  static mainListWidget() {
    item(String title, bool showLine, Function() click,
        {String? other, String? bottomStr}) {
      return Container(
          padding: EdgeInsets.only(left: 32.sp, right: 32.sp),
          color: const Color(0xFF434650),
          child: Column(children: [
            Container(
                height: 2.sp,
                color: showLine ? const Color(0xFFD8D8D8) : Colors.transparent),
            Container(
                height: 152.sp,
                child: Row(children: [
                  Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: [
                        DefaultText(title, 40.sp,
                            textColor: const Color(0xFFF9F9F9),
                            fontWeight: FontWeight.w700),
                        if (bottomStr != null)
                          DefaultText(bottomStr, 28.sp,
                              textColor: const Color(0xFFF9F9F9)),
                      ]),
                  const Expanded(child: SizedBox()),
                  DefaultText(other ?? '', 32.sp,
                          textColor: const Color(0xFFF9F9F9))
                      .marginOnly(right: 20.sp),
                  Image.asset('assets/images/home/set/right_icon.png',
                      width: 18.sp, height: 36.sp)
                ]))
          ])).addGestureDetector(click);
    }

    return GetBuilder<SetMotoController>(
        id: 'setMainList',
        builder: (controller) {
          return backWidget(Column(children: [
            ListView.builder(
                shrinkWrap: true,
                itemCount: controller.mainTitles.length,
                itemBuilder: (context, index) {
                  var other = '';
                  if (index == 0) {
                    other = controller.data?.name ?? '';
                  }
                  if (index == 1) {
                    other = '${controller.data?.shareTotal}人';
                  }
                  if (index == 5 && controller.endDate.isNotEmpty) {
                    other = DateTime.parse(controller.endDate)
                            .isAfter(DateTime.now())
                        ? '生效中'.tr
                        : '已失效'.tr;
                  }
                  if (controller.serviceStatus == 1 && index == 5) {
                    other = '未激活'.tr;
                  }

                  return item(controller.mainTitles[index], index != 0,
                      () => controller.mainTurnOtherPage(index),
                      other: other,
                      bottomStr: index == controller.mainTitles.length - 1 &&
                              controller.endDate.isNotEmpty
                          ? SR.timeEnd.tr
                              .replaceAll('xxxx', '${controller.endDate}')
                          : null);
                }),
            const Expanded(child: SizedBox()),
            DefaultBtn(
              click: () => controller.lockVehicle(),
              title: controller.data?.lock_status == 0 ? '锁定车辆'.tr : '解锁车辆'.tr,
            ).marginOnly(bottom: 112.sp)
          ]));
        });
  }

  static Widget hitBottomWidget(Function(bool) callBack) {
    return Container(
        decoration: BoxDecoration(
            color: Colors.white,
            borderRadius: BorderRadius.only(
                topRight: Radius.circular(60.sp),
                topLeft: Radius.circular(60.sp))),
        child: Column(mainAxisSize: MainAxisSize.min, children: [
          DefaultText('确定锁定车辆吗？'.tr, 48.sp, textColor: Colors.black)
              .marginOnly(top: 122.sp),
          DefaultText('非静止状态锁定车辆存在安全风险'.tr, 32.sp, textColor: Colors.black)
              .marginOnly(bottom: 112.sp, top: 20.sp),
          Container(
              padding: EdgeInsets.only(top: 2.sp),
              height: 120.sp,
              color: const Color(0xFFD8D8D8),
              child: Row(children: [
                Expanded(
                    child: Container(
                            alignment: Alignment.center,
                            color: Colors.white,
                            child: DefaultText('取消'.tr, 32.sp,
                                textColor: const Color(0xFF000000)))
                        .addGestureDetector(() => callBack(false))),
                SizedBox(width: 2.sp),
                Expanded(
                    child: Container(
                            alignment: Alignment.center,
                            color: Colors.white,
                            child: DefaultText('确认'.tr, 32.sp,
                                textColor: const Color(0xFF23C565)))
                        .addGestureDetector(() => callBack(true)))
              ]))
        ]));
  }

  static Widget changeNameWidget() {
    return GetBuilder<SetMotoController>(
        id: 'input',
        builder: (controller) {
          return backWidget(
              Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
            Container(
                height: 154.sp,
                padding: EdgeInsets.only(right: 32.sp, left: 32.sp),
                color: const Color(0xFF434650),
                child: Row(children: [
                  Expanded(
                      child: DefultTextField(40.sp,
                          textColor: const Color(0xFFF9F9F9),
                          controlle: controller.inputController)),
                  Image.asset('assets/images/home/share/clean_icon.png',
                          width: 48.sp, height: 48.sp)
                      .addGestureDetector(
                          () => controller.inputController.text = '')
                ])),
            DefaultText('设备名称不可与其他设备重复'.tr, 32.sp,
                    textColor: const Color(0xB3FFFFFF))
                .marginOnly(left: 32.sp, top: 32.sp)
          ]));
        });
  }

  static Widget parmsMainWidget() {
    return GetBuilder<SetMotoController>(
        id: 'parmsList',
        builder: (controller) {
          return backWidget(Container(
              color: const Color(0xFF434650),
              child: ListView(shrinkWrap: true, children: [
                parmsCell('低电量报警'.tr,
                    content: '${controller.ebikeSet.power_value}%',
                    hitLine: true,
                    cellClick: ({otherData}) => controller.parmsClick(0)),
                parmsCell('电子围栏'.tr,
                    hitStr: '超出设置范围内，即向您发送APP消息'.tr,
                    cellClick: ({otherData}) => controller.parmsClick(1)),
                parmsCell('自动锁车'.tr,
                    hitStr: '无轮动无振动情况下，倒计时多少秒自动关闭车辆'.tr,
                    content: '${controller.ebikeSet.leave_countdown}s',
                    cellClick: ({otherData}) => controller.parmsClick(2)),
                parmsCell('蓝牙靠近解锁'.tr,
                    hitStr: '手机与车辆蓝牙链接成功且进入设置有效距离范围内，可通过一建启动开关上电/下电车辆'.tr,
                    haveBtn: true,
                    bntSelect: controller.ebikeSet.open_lock == 1,
                    child: controller.ebikeSet.open_lock == 1
                        ? gearWidget(
                            5,
                            (controller.ebikeSet.open_lock_distance ?? 0) - 1,
                            controller.strsOther,
                            click: (data) =>
                                controller.parmsClick(3, otherData: data))
                        : null,
                    cellClick: ({otherData}) => controller.parmsClick(3)),
                parmsCell('乘坐感应'.tr,
                    hitStr: '支持自动感应用户的重量后，才能真正开动车辆'.tr,
                    haveBtn: true,
                    bntSelect: controller.ebikeSet.fly_car == 1,
                    cellClick: ({otherData}) => controller.parmsClick(4)),
                parmsCell('震动报警灵敏度设置'.tr,
                    hitStr: '支持对车辆振动报警灵敏度的高低进行设置'.tr,
                    child: gearWidget(
                        3,
                        (controller.ebikeSet.vibration_sensitivity ?? 0) - 1,
                        controller.strsOther,
                        hitTop: true,
                        click: (data) =>
                            controller.parmsClick(5, otherData: data))),
                parmsCell('故障反馈'.tr,
                    hitStr: '车辆故障信息自动上报到SAAS云平台'.tr,
                    haveBtn: true,
                    bntSelect: controller.ebikeSet.hitchs_up == 1,
                    cellClick: ({otherData}) => controller.parmsClick(6)),
                parmsCell('安全警报'.tr,
                    hitStr: '车辆设防状态下被移动超过一定距离，可能存在被盗风险，自动发送告警消息'.tr,
                    haveBtn: true,
                    bntSelect: controller.ebikeSet.alarm == 1,
                    cellClick: ({otherData}) => controller.parmsClick(7))
              ])));
        });
  }

  static Widget parmsCell(String title,
      {String? hitStr,
      String? content,
      Widget? child,
      bool haveBtn = false,
      bool bntSelect = false,
      bool hitLine = false,
      Function({int? otherData})? cellClick}) {
    return Stack(alignment: Alignment.topRight, children: [
      Column(children: [
        Container(
            color: const Color(0xFF434650),
            child: Container(
                    height: 2.sp,
                    color:
                        hitLine ? Colors.transparent : const Color(0xFFD8D8D8))
                .marginOnly(left: 32.sp, right: 32.sp)),
        Container(
            alignment: Alignment.centerLeft,
            padding: EdgeInsets.only(
                left: 32.sp,
                right: 32.sp,
                top: hitStr != null ? 44.sp : 58.sp,
                bottom: hitStr != null ? 44.sp : 58.sp),
            color: const Color(0xFF434650),
            child:
                Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
              Row(
                  mainAxisAlignment: MainAxisAlignment.start,
                  crossAxisAlignment: haveBtn
                      ? CrossAxisAlignment.start
                      : CrossAxisAlignment.center,
                  children: [
                    Expanded(
                        child: Column(
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: [
                          DefaultText(title, 40.sp,
                              textColor: const Color(0xFFF9F9F9),
                              fontWeight: FontWeight.w700),
                          if (hitStr != null)
                            DefaultText(
                              hitStr,
                              28.sp,
                              textColor: const Color(0xFFF9F9F9),
                            )
                        ])),
                    if (content != null)
                      DefaultText(content, 28.sp,
                              textColor: const Color(0xFFF9F9F9))
                          .marginOnly(right: 20.sp),
                    if (!haveBtn)
                      Image.asset('assets/images/home/share/right_image.png',
                          width: 18.sp, height: 30.sp),
                    if (haveBtn)
                      Image.asset(
                              'assets/images/home/set/btn_${bntSelect ? 'open' : 'close'}.png',
                              width: 110.sp,
                              height: 66.sp)
                          .addGestureDetector(cellClick),
                  ]),
              if (child != null) child
            ]))
      ]),
      if (!haveBtn)
        Container(width: 200.sp, height: 174.sp, color: Colors.transparent)
            .addGestureDetector(cellClick)
    ]);
  }

  ///档位设置
  static gearWidget(int count, int selectIndex, List<String> strs,
      {bool hitTop = false, Function(int data)? click}) {
    item(int indexed) {
      var width = indexed == selectIndex ? 60.sp : 40.sp;
      return Container(
              color: Colors.transparent,
              width: 60.sp,
              height: 60.sp,
              alignment: Alignment.center,
              child: Container(
                  width: width,
                  height: width,
                  decoration: BoxDecoration(
                      color: const Color(0xFF23C565),
                      borderRadius: BorderRadius.all(Radius.circular(width)))))
          .addGestureDetector(() => click != null ? click(indexed) : null);
    }

    return Stack(alignment: Alignment.center, children: [
      Container(
        height: 220.sp,
        alignment: Alignment.center,
        child: Container(height: 3.sp, color: const Color(0xFF23C565)),
      ).paddingOnly(left: 10.sp, right: 10.sp),
      Column(children: [
        Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: List.generate(
                count,
                (index) => DefaultText('${index + 1}${'档'.tr}', 32.sp,
                    textColor: hitTop
                        ? Colors.transparent
                        : const Color(0xFFF9F9F9)))),
        Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: List.generate(count, (index) => item(index)))
            .marginOnly(top: 10.sp, bottom: 10.sp),
        Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: List.generate(
                    3,
                    (index) => Container(
                        alignment: index == 0
                            ? Alignment.centerLeft
                            : index == 1
                                ? Alignment.center
                                : Alignment.centerRight,
                        width: 200.sp,
                        color: Colors.transparent,
                        child: DefaultText(strs[index], 32.sp,
                            textColor: const Color(0xFFF9F9F9)))))
            .marginOnly(left: 10.sp, right: 10.sp),
      ])
    ]).marginOnly(top: 48.sp);
  }

  static bottomListWheelScrollView(bool isProw) {
    var count = isProw ? 9 : 3;
    var number = isProw ? 10 : 60;
    final List<String> items =
        List.generate(count, (index) => '${(index + 1) * number}');
    return ShareDetailsWidgets.widowBackWidget(
        isProw ? '低电量报警'.tr : '离车倒计时关闭'.tr,
        GetBuilder<SetMotoController>(
            id: 'setlistWheel'.tr,
            builder: (controller) {
              return Column(mainAxisSize: MainAxisSize.min, children: [
                Stack(alignment: Alignment.center, children: [
                  Container(
                      alignment: Alignment.center,
                      color: Colors.transparent,
                      width: 300.sp,
                      height: 528.sp,
                      child: ListWheelScrollView.useDelegate(
                          itemExtent: 115.sp, // 设置单个项目的高度
                          useMagnifier: true,
                          magnification: 1.5,
                          perspective: 0.01,
                          squeeze: 1.0,
                          overAndUnderCenterOpacity: 0.4,
                          controller: isProw
                              ? controller.lowPowerController
                              : controller.timeSelectController,
                          physics: const FixedExtentScrollPhysics(),
                          onSelectedItemChanged: (index) =>
                              controller.listWheelChange(index, isProw),
                          childDelegate: ListWheelChildBuilderDelegate(
                              childCount: count,
                              builder: (BuildContext context, int index) {
                                return Container(
                                    alignment: Alignment.center,
                                    color: Colors.transparent,
                                    child: DefaultText(items[index], 40.sp,
                                        textColor:
                                            controller.lowPowerIndex == index
                                                ? const Color(0xFF23C565)
                                                : const Color(0xCCF9F9F9)));
                              }))),
                  SizedBox(
                      height: 115.sp,
                      child: Column(children: [
                        Image.asset('assets/images/home/set/line_image.png',
                            height: 6.sp),
                        const Expanded(child: SizedBox()),
                        Image.asset('assets/images/home/set/line_image.png',
                            height: 6.sp)
                      ]))
                ]),
                DefaultBtn(
                        click: () => controller.changeLowPower(isProw),
                        title: '确认'.tr)
                    .marginOnly(bottom: 112.sp)
              ]);
            }),
        hitLine: true);
  }

  static informationTopWidget(MotoModel data) {
    item(int type) {
      return Container(
          color: Colors.transparent,
          constraints: BoxConstraints(
            minWidth: 220.sp,
          ),
          child:
              Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
            Row(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Image.asset('assets/images/home/set/battery_0${type + 1}.png',
                        width: 32.sp, height: 56.sp)
                    .marginOnly(bottom: 20.sp, right: 24.sp),
                DefaultText('电池容量'.tr, 28.sp,
                        textColor: const Color(0xFF999999))
                    .marginOnly(top: 10.sp)
              ],
            ),
            DefaultText(
                    type == 1 ? '${data.battery_capacity}' : '${data.power}%',
                    48.sp,
                    textColor: const Color(0xFFF9F9F9))
                .marginOnly(top: 10.sp)
          ]));
    }

    return Container(
      margin: EdgeInsets.only(left: 32.sp, right: 32.sp),
      padding:
          EdgeInsets.only(left: 74.sp, right: 74.sp, top: 84.sp, bottom: 70.sp),
      decoration: BoxDecoration(
          color: const Color(0xFF434650),
          borderRadius: BorderRadius.all(Radius.circular(56.sp))),
      child: Row(mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [
        item(0),
        Container(width: 2.sp, height: 158.sp, color: const Color(0xFFF9F9F9)),
        item(1)
      ]),
    );
  }

  static informationBottomWidget(MotoModel data) {
    item(type, title, norml) {
      return Container(
          padding: EdgeInsets.only(left: 32.sp),
          constraints: BoxConstraints(
            minWidth: 220.sp,
          ),
          child:
              Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
            // DefaultBtn(
            //         click: () => null,
            //         title: norml ? '正常'.tr : '未连接'.tr,
            //         size: 28.sp,
            //         // width: 134.sp,
            //         height: 56.sp,
            //         fontWeight: FontWeight.normal,
            //         backColor: norml
            //             ? const Color(0xFF23C565)
            //             : const Color(0xFFFC720B))
            Container(
                    alignment: Alignment.center,
                    height: 56.sp,
                    padding: EdgeInsets.only(left: 20.sp, right: 20.sp),
                    color: norml
                        ? const Color(0xFF23C565)
                        : const Color(0xFFFC720B),
                    child: DefaultText(norml ? '正常'.tr : '未连接'.tr, 28.sp,
                        textColor: Colors.white))
                .didClipRRectAll(56.sp)
                .marginOnly(bottom: 26.sp),
            Image.asset('assets/images/home/set/set_typ${type}_icon.png',
                    width: 46.sp, height: 46.sp)
                .marginOnly(bottom: 16.sp),
            DefaultText(title, 28.sp, textColor: const Color(0xFF999999))
          ]));
    }

    line() {
      return Container(
          width: 2.sp, height: 158.sp, color: const Color(0xFFF9F9F9));
    }

    return Container(
        margin: EdgeInsets.only(left: 32.sp, right: 32.sp, top: 32.sp),
        padding: EdgeInsets.only(top: 48.sp, bottom: 48.sp),
        decoration: BoxDecoration(
            color: const Color(0xFF434650),
            borderRadius: BorderRadius.all(Radius.circular(56.sp))),
        child: Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
          DefaultText('当前车况'.tr, 40.sp, textColor: const Color(0xFFF9F9F9))
              .marginOnly(bottom: 50.sp, left: 32.sp),
          Row(mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [
            item(0, '车辆GPS'.tr, data.have4G),
            line(),
            item(1, '蓝牙连接'.tr, data.contentBlue),
            line(),
            item(2, '4G连接'.tr, data.have4G)
          ])
        ]));
  }

  static contentWidget(List contents, Function(int) copy,
      Function(int) btnClick, Function update, showUpdate, version) {
    var titles = ['车辆型号'.tr, 'IMEI', 'SN', '车架号'.tr, '手机号'.tr];
    return Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
      DefaultText('车辆信息'.tr, 32.sp, textColor: const Color(0xB3FFFFFF))
          .marginOnly(top: 22.sp, bottom: 22.sp, left: 32.sp),
      Column(
        mainAxisSize: MainAxisSize.min,
        children: List.generate(
            titles.length,
            (index) => inforItem(
                titles[index], '${contents[index]}', () => copy(index),
                hitLine: index == 0, hitBtn: index == 0 || index == 5)),
      ),
      Column(
        mainAxisSize: MainAxisSize.min,
        children: [
          Container(
            height: 20.sp,
            color: Colors.transparent,
          ),
          firmwareItem(update, showUpdate),
          firmwareVersionItem(version),
        ],
      ),
      Row(mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [
        DefaultBtn(click: () => btnClick(0), title: '解除绑定', width: 360.sp),
        DefaultBtn(
            click: () => btnClick(1),
            title: '授权转让',
            width: 360.sp,
            textColor: const Color(0xFF23C565),
            backColor: Colors.white)
      ]).marginOnly(left: 32.sp, right: 32.sp, top: 100.sp),
      SizedBox(
        height: 40.sp,
      ),
    ]);
  }

  static inforItem(title, content, Function() copy,
      {bool hitLine = false, bool hitBtn = false}) {
    return Container(
        color: const Color(0xFF434650),
        child: Column(children: [
          Container(
              height: 2.sp,
              color: hitLine ? Colors.transparent : const Color(0xFFD8D8D8)),
          Row(children: [
            DefaultText(title, 40.sp,
                textColor: const Color(0xFFF9F9F9),
                fontWeight: FontWeight.w700),
            const Expanded(child: SizedBox()),
            DefaultText(content, 32.sp, textColor: const Color(0xFFF9F9F9))
                .marginOnly(right: 20.sp),
            if (!hitBtn)
              Image.asset('assets/images/home/set/copy_icon.png',
                      width: 40.sp, height: 48.sp)
                  .addGestureDetector(copy)
          ]).marginOnly(top: 58.sp, bottom: 58.sp)
        ]).marginOnly(left: 32.sp, right: 32.sp));
  }

  static firmwareItem(Function update, hitUpdate) {
    return Container(
      color: const Color(0xFF434650),
      child: Column(
        children: [
          Row(
            children: [
              DefaultText('固件版本'.tr, 40.sp,
                  textColor: const Color(0xFFF9F9F9),
                  fontWeight: FontWeight.w700),
              const Expanded(child: SizedBox()),
              if (hitUpdate)
                DefaultBtn(
                    click: () {
                      update();
                      // print('升级');
                    },
                    title: '升级'.tr,
                    width: 200.sp),
              SizedBox(
                width: 10.sp,
              ),
              DefaultBtn(
                  click: () {
                    Get.toNamed(RouteGet.motoRecord)?.then((value) {
                      Get.delete<OtaRecordController>();
                    });
                  },
                  title: '升级记录'.tr,
                  width: 300.sp,
                  textColor: const Color(0xFF23C565),
                  backColor: Colors.white),
            ],
          ).marginOnly(top: 58.sp, bottom: 58.sp),
        ],
      ).marginOnly(left: 32.sp, right: 32.sp),
    );
  }

  static firmwareVersionItem(version) {
    return Container(
      color: const Color(0xFF434650),
      child: Column(
        children: [
          Container(height: 2.sp, color: const Color(0xFFD8D8D8)),
          Row(
            children: [
              DefaultText('固件版本'.tr, 40.sp,
                  textColor: const Color(0xFFF9F9F9),
                  fontWeight: FontWeight.w700),
              const Expanded(child: SizedBox()),
              DefaultText(version ?? '', 40.sp,
                  textColor: const Color(0xFFF9F9F9),
                  fontWeight: FontWeight.w700),
            ],
          ).marginOnly(top: 58.sp, bottom: 58.sp),
        ],
      ).marginOnly(left: 32.sp, right: 32.sp),
    );
  }

  static mainWidget(
      List<TextEditingController> controllers,
      // List<FocusNode> transferFocusNodes,
      Function() addInput,
      Function(int) delect,
      Function() finished) {
    return Column(children: [
      DefaultText('授权给其他人后，您将会失去绑定车辆身份资格，请谨慎操作'.tr, 32.sp,
              textColor: const Color(0xB3FFFFFF))
          .marginOnly(left: 32.sp, right: 32.sp, bottom: 22.sp),
      Column(
          mainAxisSize: MainAxisSize.min,
          children: List.generate(
              controllers.length,
              (index) => transferInputWidget(controllers[index],
                  () => delect(index), controllers.length > 1))),
      Container(
              alignment: Alignment.center,
              color: const Color(0xFF434650),
              height: 120.sp,
              child: Image.asset('assets/images/user/add_image.png',
                  color: Colors.white))
          .didClipRRectAll(30.sp)
          .marginOnly(top: 32.sp, left: 32.sp, right: 32.sp)
          .addGestureDetector(addInput),
      const Expanded(child: SizedBox()),
      DefaultBtn(click: finished, title: '确认授权'.tr).marginOnly(bottom: 112.sp)
    ]);
  }

  static transferInputWidget(
      TextEditingController controller, Function() delect, bool delected) {
    return Container(
            color: const Color(0xFF313131),
            padding: EdgeInsets.only(left: 40.sp, right: 40.sp),
            height: 120.sp,
            child: Row(children: [
              Expanded(
                  child: DefultTextField(
                32.sp,
                hintText: '请输入授权手机号'.tr,
                keyboardType: TextInputType.number,
                controlle: controller,
              )),
              if (delected)
                Image.asset('assets/images/home/set/delect_icon.png',
                        width: 48.sp, height: 48.sp)
                    .addGestureDetector(delect)
            ]))
        .didClipRRectAll(120.sp)
        .marginOnly(left: 40.sp, right: 40.sp, bottom: 32.sp);
  }

  static Widget purchaseTopWidget(List<CommodityModel> datas, int selectIndex,
      Function(int) didSelect, bool agreed, Function(int) chnageAgree) {
    Widget itme(CommodityModel data, bool select) {
      return Container(
          width: 220.sp,
          height: 300.sp,
          decoration: BoxDecoration(
              color: const Color(0xFF434650),
              borderRadius: BorderRadius.circular(56.sp), // 设置圆角半径
              border: Border.all(
                color: select
                    ? const Color(0xFF23C565)
                    : const Color(0xFF434650), // 设置边框颜色
                width: 2.sp, // 设置边框宽度
              )),
          child: Column(mainAxisAlignment: MainAxisAlignment.center, children: [
            DefaultText(data.type == 2 ? '连续包年'.tr : '${data.years} 年', 38.sp,
                    textColor: const Color(0xFFF9F9F9),
                    fontWeight: FontWeight.w700)
                .marginOnly(bottom: 30.sp),
            DefaultText('¥ ${data.money ?? 0}', 48.sp,
                textColor: const Color(0xFFF9F9F9),
                fontWeight: FontWeight.w700),
          ])).marginOnly(right: 20.sp);
    }

    return Container(
        child: Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
      DefaultText('续费套餐'.tr, 38.sp, textColor: const Color(0xB3FFFFFF))
          .marginOnly(bottom: 20.sp),
      Container(
          color: Colors.transparent,
          height: 300.sp,
          child: ListView(
              scrollDirection: Axis.horizontal,
              children: List.generate(
                  datas.length,
                  (index) => itme(datas[index], selectIndex == index)
                      .addGestureDetector(() => didSelect(index))))),
      DefaultText(
              datas[selectIndex].type == 2
                  ? '到期前自动续费${datas[selectIndex].money}/年，可随时取消'
                  : '包年费用'.tr,
              28.sp,
              textColor: const Color(0xB3FFFFFF))
          .marginOnly(bottom: 20.sp, top: 60.sp),
      Row(children: [
        Image.asset(
                'assets/images/login/${agreed ? 'agreed_icon.png' : 'agreed_not_icon.png'}',
                width: 48.sp,
                height: 48.sp)
            .addGestureDetector(() => chnageAgree(0))
            .marginOnly(right: 20.sp),
        DefaultText('支付协议'.tr, 38.sp, textColor: const Color(0xFF23C565))
            .addGestureDetector(() => chnageAgree(1))
      ])
    ]).marginOnly(left: 32.sp, right: 32.sp));
  }

  static Widget purchaseBottomWidget() {
    List<String> titles = [
      '实时定位车辆位置'.tr,
      '获取骑行轨迹数据'.tr,
      '安全范围防盗锁车'.tr,
      '推送防盗报警信息'.tr,
    ];
    List<String> images = [
      'assets/images/home/main/bottom_0.png',
      'assets/images/home/main/bottom_4.png',
      'assets/images/home/main/bottom_2.png',
      'assets/images/home/main/bottom_1.png'
    ];
    item(String title, String image, {bool showLine = true}) {
      return Container(
          color: const Color(0xFF434650),
          child: Column(children: [
            Container(
                height: 2.sp,
                color: showLine ? const Color(0xFFD8D8D8) : Colors.transparent),
            Row(children: [
              Image.asset(image,
                      width: 112.sp,
                      height: 112.sp,
                      color: const Color(0xFF23C565))
                  .marginOnly(right: 30.sp),
              DefaultText(title, 38.sp,
                  textColor: const Color(0xFFF9F9F9),
                  fontWeight: FontWeight.w700),
            ]).marginOnly(top: 54.sp, bottom: 54.sp)
          ]).marginOnly(left: 32.sp, right: 32.sp));
    }

    return Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        mainAxisSize: MainAxisSize.min,
        children: [
          DefaultText('智能服务'.tr, 38.sp, textColor: const Color(0xB3FFFFFF))
              .marginOnly(bottom: 50.sp, top: 54.sp, left: 32.sp),
          Column(
              mainAxisSize: MainAxisSize.min,
              children: List.generate(
                  titles.length,
                  (index) =>
                      item(titles[index], images[index], showLine: index != 0)))
        ]);
  }

  static Widget paymentWidget(CommodityModel data) {
    item() {
      return Container(
          color: const Color(0xFF434650),
          child: Row(children: [
            Container(
                    color: Colors.white,
                    child: Image.asset('assets/images/home/set/zfb_icon.png',
                        width: 112.sp, height: 112.sp))
                .didClipRRectAll(112.sp)
                .marginOnly(right: 32.sp),
            DefaultText('支付宝'.tr, 38.sp, textColor: const Color(0xFFF9F9F9)),
            const Expanded(child: SizedBox()),
            Image.asset('assets/images/login/agreed_icon.png',
                width: 60.sp, height: 60.sp)
          ]).marginOnly(left: 20.sp, right: 32.sp, top: 24.sp, bottom: 24.sp));
    }

    return Container(
        alignment: Alignment.center,
        child: Column(children: [
          Column(
              crossAxisAlignment: CrossAxisAlignment.center,
              mainAxisSize: MainAxisSize.min,
              children: [
                DefaultText('支付金额'.tr, 38.sp,
                        textColor: const Color(0xFFF9F9F9))
                    .marginOnly(bottom: 40.sp, top: 40.sp),
                DefaultText('¥ ${data.money}', 78.sp,
                    textColor: const Color(0xFFF9F9F9),
                    fontWeight: FontWeight.w700),
              ]),
          Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
            DefaultText('选择付款方式'.tr, 38.sp, textColor: const Color(0xFFF9F9F9))
                .marginOnly(
                    left: 32.sp, right: 32.sp, bottom: 40.sp, top: 100.sp),
            Column(children: [item()])
          ])
        ]));
  }
}
